<html xmlns:th="http://www.thymeleaf.org"><!-- Thymeleaf??????????????????? -->
<head>
    <meta content="text/html;charset=UTF-8"/>
    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
<title th:utext="#{message.resetPassword}">reset</title>
</head>
<body>
<div class="container">
    <h1 th:utext="#{message.resetPassword}">reset</h1>
    <br/>
    <div class="row">
      <form action="#">
        <label class="col-sm-1" th:utext="#{label.user.email}">email</label>
        <span class="col-sm-5"><input class="form-control" id="email" name="email" type="email" value="" required="required" /></span>
        <button class="btn btn-primary" type="submit" th:utext="#{message.resetPassword}">reset</button>
      </form>
    </div>

<br/> 
<a class="btn btn-default" th:href="@{/registration.html}" th:utext="#{label.form.loginSignUp}">registration</a>
<br/><br/>
<a class="btn btn-default" th:href="@{/login}" th:utext="#{label.form.loginLink}">login</a>

</div>
<script th:src="@{/js/jquery-3.5.1.min.js}" type="text/javascript"></script>
<script th:inline="javascript">
    var serverContext = [[@{/}]];

    $(document).ready(function () {
        $('form').submit(function(event) {
            resetPass(event);
        });
    });

    function resetPass(event){
        event.preventDefault();
        var email = $("#email").val();
        $.post(serverContext + "user/resetPassword",{email: email} ,function(data){
                window.location.href = serverContext + "login?message=" + data.message;
        })
        .fail(function(data) {
            if(data.responseJSON.error.indexOf("MailError") > -1)
            {
                window.location.href = serverContext + "emailError.html";
            }
            else{
                window.location.href = serverContext + "login?message=" + data.responseJSON.message;
            }
        });
    }

    $(document).ajaxStart(function() {
        $("title").html("LOADING ...");
    });
</script>
</body>

</html>